<!-- 封装树形结构 -->
<template>
  <div class="tree">
    <!-- 操作按钮 -->
    <el-button @click="resetChecked">清空</el-button>
    <el-tree
      ref="treeRef"
      :data="props.TreeRoles"
      show-checkbox
      default-expand-all
      node-key="id"
      :default-expanded-keys="[2, 3]"
      :default-checked-keys="[5]"
      :props="defaultPropss"
    />
  </div>
</template>

<script setup>
import { ref, watch } from 'vue'
const props = defineProps({
  TreeRoles: {
    type: Array,
    default: [],
  },
})
const defaultPropss = {
  children: 'children',
  label: 'name',
}

// const emit = defineEmits([''])
const treeRef = ref([])

const resetChecked = () => {
  treeRef.value.setCheckedKeys([], false)
}
</script>
<style lang='less' scoped>
</style>